<%@ taglib prefix="s" uri="/struts-tags"%>
<script type="text/javascript">
  var grid = jQuery("#listDueDatePeriod");
  jQuery("#listDueDatePeriod").jqGrid(
      {
        url : '${pageContext.request.contextPath}/misc/period/dueDate/getDueDatePeriods.action',
        datatype : "json",
        colNames : ['ID','<s:property value="getText(\'field.due.date.period.code\')" />',
            '<s:property value="getText(\'field.year\')" />',
            '<s:property value="getText(\'field.month\')" />',
            '<s:property value="getText(\'field.week\')" />',
            '<s:property value="getText(\'field.day\')" />'],
        colModel : [{
          name : 'id',
          index : 'id',
          hidden : true,
          width : 10
        },{
          name : 'code',
          index : 'code',
          width : 150
        },{
          name : 'year',
          index : 'year',
          width : 100,
        },{
          name : 'month',
          index : 'month',
          width : 100,
        },{
          name : 'week',
          index : 'week',
          width : 100,
        },{
          name : 'day',
          index : 'day',
          width : 100,
        }],
        jsonReader : {
          root : "rows",
          page : "page",
          total : "total",
          records : "records",
          repeatitems : false,
          id : "id",
          cell : "",
          userdata : ""
        },
        rowNum : 10,
        rowList : [10,20,30],
        pager : '#pagingDueDatePeriod',
        sortname : 'code',
        viewrecords : true,
        sortorder : "asc",
        multiselect : false,
        autowidth : true,
        height : 325,
        caption : "<s:property value='getText(\"title.list.due.date.period\")' />"
      }).navGrid('#pagingDueDatePeriod',{
    edit : false,
    add : true,
    del : false,
    view : false,
    search : false,
    addfunc : function() {
      $('#editDueDatePeriod').load('misc/period/dueDate/addDueDatePeriod.action');
    }
  });
</script>
<div style="width: 800px;">
  <table id="listDueDatePeriod"></table>
  <div id="pagingDueDatePeriod"></div>
  <div id="editDueDatePeriod"></div>
</div>